<template>
    <div class="app-container">
       <el-row type="flex" style="justify-content: space-between">
            <div style="flex: 1; min-width: 0;margin-right: 5px; ">
                <storage-customer-info :value="detailInfo"></storage-customer-info>
                <storage-order-info :value="detailInfo" v-if="detailInfo != null && detailInfo.carInStorage != null"></storage-order-info>
                <storage-purchase-info :value="detailInfo" v-if="!isShow"></storage-purchase-info>
                <storage-supplier-info :value="detailInfo" v-if="isShow"></storage-supplier-info>
                <storage-car-info :value="detailInfo" v-if="detailInfo != null && detailInfo.carInStorage != null"></storage-car-info>
                <storage-in-inventory-info :value="detailInfo"></storage-in-inventory-info>
            </div>  
            <FlowRecord v-if="flowId" :id="flowId" :customStyle="{minWidth:'280px',marginBottom:'20px'}"/>
        </el-row> 
        <div class="card-wrap flex justify-end card-padding">
            <el-button @click="back">返回</el-button>
        </div>
    </div>
</template>

<script>
import StorageCustomerInfo from "@/views/carInventory/components/StorageCustomerInfo.vue";
import StorageOrderInfo from "@/views/carInventory/components/StorageOrderInfo.vue";
import StoragePurchaseInfo from "@/views/carInventory/components/StoragePurchaseInfo.vue";
import StorageSupplierInfo from "@/views/carInventory/components/StorageSupplierInfo.vue";
import StorageCarInfo from "@/views/carInventory/components/StorageCarInfo.vue";
import * as inInventoryApi from "@/api/carInventory/inInventory";
import StorageInInventoryInfo from "@/views/carInventory/components/StorageInInventoryInfo.vue";
export default {
    components: {StorageInInventoryInfo, StorageCarInfo, StorageSupplierInfo, StoragePurchaseInfo, StorageOrderInfo, StorageCustomerInfo},
    props: {},
    data() {
        return {
            detailInfo:null,
            isShow:false,
            flowId:null,
        }
    },
    computed: {},
  created() {
    this.getDetail()

  },

  mounted() {
        console.log(this.$route.query)
        // 1是外部转租赁 展示外部转租赁模块 2是正常展示采信息
        if(this.$route.query.source==1){
            this.isShow = true
        }else{
            this.isShow = false
        }

    },
    methods: {

        // 获取入库单详情
        getDetail(){           
            inInventoryApi.inStorageDetails(this.$route.query.inboundId).then(info=>{
                if(info.data){
                    this.flowId = info.data?.carInStorage?.flowId
                    console.log(this.flowId,'info.datainfo.data')
                    this.detailInfo = {...info.data,inboundId:this.$route.query.inboundId,source:this.$route.query.source}
                }

            })
        },
        back(){
            this.$router.back()
        },
    },
  

}
</script>

<style lang="scss" scoped>

::v-deep .el-form--label-top .el-form-item__label {
    padding: 0;
}

.el-form-item {
    margin-bottom: 15px;
    width: 70%;
}
</style>
